<template>
	<view class="booking-notice">
    <view>
      请您在预定本次公寓房屋住宿房源 (以下简称“本房
      源”)之前认真阅读并确认知悉以下提示内容:
      <view class="text-title section-container">一、定金用途及有效期</view>
      (1) 本房源定金主要用于住宿担保和房间号锁定
      南舒房将于您完成定金支付后为您锁定本房源并生成
      房源预定单，本房源具体对应的房间号以及预定有
      效期均以预定单生成内容为准，请您在预定有效期
      内完成本房源的正式签约。
      <view class="text-title section-container">二、预定须知</view>
      (1) 因您自身原因导致未在预定有效期内按本提示
      完成签约的，则视为您放弃本次预定，本房源将自
      动解除锁定，该房源因此被他人预定或签约的，南舒房不就此向您承担任何违约或赔偿责任，同时<text class="text-title">定金不予退还</text>。
      <view class="section-container">
        (2) 因客观原因(包括但不限于房屋损坏，房屋装
        修配置出现严重问题以及不可抗力等)导致本房源
        不适宜继续供您住宿使用的，南舒房将根据实际情
        况，向您提供本门店中与本房源条件相同的替代住
        宿房源，或取消您的本次预定，向您无息退还已付
        定金。
      </view>
      <view class="section-container">
        (3) 如您如期完成本房源签约，定金将于签约日起
        自动转为住宿预付款项，用于抵扣您在住宿服务/租
        赁合同中的应付款项。
      </view>
      <view class="section-container">
        如对本房源预定说明有任何疑问，请联系门店。
      </view>
    </view>
		<view class="bottom-btn">
			<view class="left item" @click="down">
				拒绝
			</view>
			<view class="right item" @click="submit">
				接受
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:''
			}
		},
		onLoad(options) {
			console.log(options);
			this.id = options.id
		},
		methods:{
			down(){
				setTimeout(()=>{
					uni.navigateBack({
						url:'/pages/personal/deposit/depositList'
					})
				},500)
			},
			submit(){//支付房间预定
				uni.navigateTo({
					url: `/pages/personal/pay/index?id=${this.id}&type=ROOM_RESERVE`
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.booking-notice {
		width: 100%;
		height: 100vh;
		background-color: $uni-bg-color;
		box-sizing: border-box;
    padding: 20rpx 32rpx;
		padding-bottom: 80rpx !important;
    overflow-y: auto;
    .section-container{
      margin-top: 10px;
    }
    .text-title {
      font-size: 1.17em;
      font-weight: bold;
    }
		.bottom-btn {
			width: calc(100vw - 64rpx);
			height: 94rpx;
			position: fixed;
			bottom: 0;
      left: 32rpx;
			padding: 10rpx 0;
			box-sizing: border-box;
			display: flex;
			background-color: #fff;

			.left {
				background: rgba(237, 237, 237, 1);
				color: rgba(102, 102, 102, 1);
				text-align: center;
				line-height: 74rpx;
				margin-right: 40rpx;
			}

			.right {
				background: rgba(253, 150, 24, 1);
				color: rgba(255, 255, 255, 1);
				text-align: center;
				line-height: 74rpx;
			}

			.item {
				width: calc(50% - 10rpx);
				height: 100%;
				opacity: 1;
				border-radius: 100px;
			}
		}
	}
</style>
